<template>
  <div class="app-container" style="width:100%;height:640px;">
    <div class="block" style="width:100%;height:100%;">
      <el-tree
        ref="tree"
        class="filter-tree"
        :data="data2"
        node-key="id"
        :props="defaultProps"
        show-checkbox
        default-expand-all
        :expand-on-click-node="false"
      />
    </div>
    <div style="text-align:center; padding-top:10px">
      <el-button type="primary" @click="saveAuth">保存</el-button>
      <el-button type="danger" @click="closePage">取消</el-button>
    </div>
  </div>
</template>

<script>
import { Message } from 'element-ui'

import { getAuthTreeList, saveAuthorit } from '@/api/publicFileAuthority'

export default {
  name: 'Zzjg',
  inject: ['getList'],
  props: { // 第二种方式
    proid: {
      type: String,
      required: true
    },
    flag: {
      type: String,
      required: true
    }
  },
  data() {
    return {
      data: [],
      data2: [],
      form: {},
      defaultProps: {
        children: 'children',
        label: 'name'
      },
      hashAuthId: []
    }
  },
  created() {
    this.getDetailed()
  },
  methods: {
    getDetailed() {
      this.data = []

      getAuthTreeList({ fileId: this.proid, type: this.flag }).then(response => {
        this.data = response.data.list

        this.data2 = this.buildTree2(this.data)
        this.hashAuthId = response.data.hashAuthId

        this.$refs.tree.setCheckedKeys(this.hashAuthId)
        this.listLoading = false
      }).catch(response => {
        this.listLoading = false
      })
    },
    buildTree2(data) {
      var rdata = []
      for (let i = 0; i < data.length; i++) {
        var e1 = data[i]
        if (e1.parentId === '-1') {
          rdata.push(e1)
        }
        for (let j = 0; j < data.length; j++) {
          var e2 = data[j]
          if (e1.parentId === e2.id) {
            if (!e2.children) {
              e2.children = []
            }
            e2.children.push(e1)
          }
        }
      }
      return rdata
    },
    getSimpleCheckedNodes(store) {
      // 定义数组
      const checkedNodes = []
      // 判断是否为全选，若为全选状态返回被全选的节点，不为全选状态正常返回被选中的节点
      const traverse = function(node) {
        const childNodes = node.root ? node.root.childNodes : node.childNodes
        childNodes.forEach(child => {
          if (child.checked) {
            checkedNodes.push(child.data)
          }
          if (child.indeterminate) {
            traverse(child)
          }
        })
      }
      traverse(store)
      return checkedNodes
    },
    saveAuth() {
      var list2 = []
      var list = this.getSimpleCheckedNodes(this.$refs.tree.store) // tree为组件定义的ref
      for (let i = 0; i < list.length; i++) {
        if (list[i].children != null) {
          // list2.push(list[i].id)
          var data = list[i].children
          for (let j = 0; j < data.length; j++) {
            list2.push(data[j].id)
          }
        } else {
          list2.push(list[i].id)
        }
      }

      const loading = this.$loading({
        lock: true,
        text: 'Loading',
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.7)'
      })

      saveAuthorit({ fileId: this.proid, type: this.flag, userIds: list2 }).then(response => {
        Message({
          message: '操作成功',
          type: 'success',
          duration: 5 * 1000
        })

        this.$emit('update:visible', false)
        loading.close()
        // 重新加载表格
        this.getList()
      }).catch(response => {
        loading.close()
      })
    },
    closePage() {
      this.$emit('update:visible', false)
    }
  }
}
</script>

<style scoped>

</style>
